<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>听个锤子</title>
    <style>
        @import url("听个锤子.css");
        body{
            background: url(img/14.jpg) no-repeat center;
            text-decoration:none;
            letter-spacing: 1px;
        }
        a{
            text-decoration:none;
            color:#000000;
        }
    </style>      
</head>
<body>
    <div id="app">
        <div id="backgd">
            <div id="top">
                <div id="top_logo">
                    <a href="#"><img id="logo" src="img/听个锤子1.png" title="听个锤子app" width="50%" height="100%"@click="changemenu"style="margin-left:50px;"></a> 
                </div>
                <div id="top_search">                   
                    <input type="text"autocomplete="off"class="searchText"id="searchText" placeholder=" 这里输入歌名哦!" @keyup.enter="searchMusic" v-model="musicName">                         
                </div>    
                <div id="top_button">
                    <a href="#"><font id="p0" @click="gethistoryList">历史记录</font></a>
                    <div id="historyList" v-show="isView4">
                        <span  v-for="(item,index) in historyList">
                            <a id="a1"  href="#st" v-if="item" :title=item @click="changeName(item)">{{index+1}}.{{item}}</a>
                            <img src="img/删除.png" v-if="item" title="删除歌曲"width="10px" height="10px"@click="delHistoryList(index)">&nbsp;&nbsp;
                        </span>
                        <a id="a1" href="javascript:;" v-if="historyList.length"  @click="clearHistoryList"style="float:right">清空</a>
                    </div>                        
                    <a href="#"><img src="img/搜索.png"@click="searchMusic" width="40PX" height="40px"style="padding-top:10px;"></a>  
                    <a href="###"><img src="img/设置.png" @click="imgShow"style="margin-left:70px;"></a>     
                </div>           
            </div> 
            <div class="right_button" id="right_button" v-show="imgshow">
                 <ul class="nav" id="nav">
                     <li><a href="#">更换皮肤</a>
                        <ul>           
                            <li><a href="#"><img src="img/6.jpg"></a></li>
                            <li><a href="#"><img src="img/7.jpg"></a></li>
                            <li><a href="#"><img src="img/8.jpg"></a></li>
                            <li><a href="#"><img src="img/9.jpg"></a></li>
                            <li><a href="#"><img src="img/10.jpg"></a></li>
                            <li><a href="#"><img src="img/14.jpg"></a></li>
                            <li><a href="#"><img src="img/15.jpg"></a></li>
                            <li><a href="#"><img src="img/16.jpg"></a></li>
                            <li><a href="#"><img src="img/20.jpg"></a></li>
                            <li><a href="#"><img src="img/21.jpg"></a></li>
                            <li><a href="#"><img src="img/22.jpg"></a></li>
                            <li><a href="#"><img src="img/24.jpg"></a></li>
                        </ul>
                    </li>
                    <li><a href="#" @click="author">关于我们</a></li>
                 </ul>
            </div>
            <div id="content">
                <div id="menu"v-show="isViewmenu">
                    <div id="menu_top">
                        <a href="#" @click="get1"><font :class="{newget1page:(ismenu1==true)}">歌单</font></a>
                        <a href="#" @click="get2"><font :class="{newget1page:(ismenu2==true)}"style="margin-left:50px;">歌手</font></a>
                        <a href="#" @click="get3"><font :class="{newget1page:(ismenu3==true)}"style="margin-left:50px;">MV</font></a>
                        <a href="#" @click="get4"><font :class="{newget1page:(ismenu4==true)}"style="margin-left:50px;">榜单</font></a>
                        <hr color="#28858b" width="80%">
                    </div>
                    <div id="menu1" v-show="ismenu1">
                        <div v-show="!isViewget1">                     
                            <font id="st1" style="font-size: 30px;">{{get1_1}}&nbsp;</font>
                            <span id="menu1_span"><a href="#" @click="isViewmenu1_1">选择分类></a></span>
                            <font>找到{{get1total}}张歌单</font>
                            <a href="#":class="{newget1page:(get1_2=='new')}" @click="get1ss('new')"><font>最新</font></a>
                            <a href="#":class="{newget1page:(get1_2=='hot')}" @click="get1ss('hot')"><font>热门</font></a>
                            <div id="menu1_1" v-show="ismenu1_1">
                                <a style="font-size: 20px;" href="#" @click="get1s('全部')">全部风格</a><br>
                                <font style="font-size: 20px;">语言:&nbsp;&nbsp;</font>
                                <font v-for="item in get1type1">
                                    <a href="#" @click="get1s(item)">{{item}}</a>&nbsp;&nbsp;|&nbsp;
                                </font><br>                                                         
                                <font style="font-size: 20px;">风格:&nbsp;&nbsp;</font>
                                <font v-for="item in get1type2">
                                    <a href="#" @click="get1s(item)">{{item}}</a>&nbsp;&nbsp;|&nbsp;
                                </font><br>  
                                <font style="font-size: 20px;">场景:&nbsp;&nbsp;</font>
                                <font v-for="item in get1type3">
                                    <a href="#" @click="get1s(item)">{{item}}</a>&nbsp;&nbsp;|&nbsp;
                                </font><br> 
                                <font style="font-size: 20px;">情感:&nbsp;&nbsp;</font>
                                <font v-for="item in get1type4">
                                    <a href="#" @click="get1s(item)">{{item}}</a>&nbsp;&nbsp;|&nbsp;
                                </font><br> 
                                <font style="font-size: 20px;">主题:&nbsp;&nbsp;</font>
                                <font v-for="item in get1type5">
                                    <a href="#" @click="get1s(item)">{{item}}</a>&nbsp;&nbsp;|&nbsp;
                                </font><br> 
                            </div>
                            <div id="menu1_2">
                                <div id="menu1_2_">
                                    <div id= "menu1_2_1" v-for="(item,index) in get1_3">                                
                                        <a href="#"><img :src="item.coverImgUrl+'?param=130y130'":title=item.name class="coverImgUrl2"@click="get1music(item)"></a><br>
                                        <a href="#" @click="get1music(item)"style="margin-bottom:0px">{{item.name}}</a>                               
                                    </div>
                                </div>
                                <div id="menu1_2_2">
                                    <a href="#st1"@click="get1offsettop">首页&nbsp;&nbsp;</a>
                                    <a href="#st1"><font v-show="get1offset>0"@click="get1offsetsub">上一页</font></a>  
                                    <span v-for="cound in get1page">
                                        <a href="#st1" :class="{newget1page:((get1offset+1)==cound)}" v-if="get1offset+5>=cound&&cound>=get1offset-3" @click="get1offsetpage(cound)">{{cound}}&nbsp;&nbsp;</a>
                                    </span>
                                    <a href="#st1"><font v-show="get1total>(get1offset*48+48)" @click="get1offsetadd">下一页</font></a>
                                    <a href="#st1"@click="get1offsetbot">&nbsp;&nbsp;尾页&nbsp;&nbsp;</a>
                                    <font>第</font>
                                    <input id="get1jump" type="text" :placeholder="get1offset+1"onafterpaste="this.value=this.value.replace(/\D/g,'')" onkeyup="this.value=this.value.replace(/\D/g,'')" style="width:20px;"@keyup.enter="get1jump">
                                    <font>页&nbsp;&nbsp;共有{{get1page}}页</font>
                                </div>
                            </div>
                        </div>
                        <div v-show="isViewget1">
                            <div style="float: left;">
                                <div>
                                    <a href="#" @click="returnmenu1"><font style="font-size: 20px;"title="返回歌单">返回歌单</font></a>  
                                </div>
                                <div id="menu1_3_1">
                                    <img :src="get1_4.coverImgUrl+'?param=130y130'"width="150px"height="150px" :title=get1_4.name><br>
                                    <font :title=get1_4.name>{{get1_4.name}}</font><br>
                                </div>
                                <div id="menu1_3_2">
                                    <center><h3>简介</h3></center>
                                    <div id="menu1_3_2_">
                                        <font :title=get1_4.description>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{get1_4.description}}</font><br>
                                    </div>
                                </div>
                            </div>
                            <div id="menu1_3_3">
                                <div style="margin-bottom: 50px;">
                                    <font id="p6" style="padding-left: 60px;">歌名</font>
                                    <font id="p6" style="padding-left: 315px;">歌手</font>
                                    <font id="p6" style="padding-left: 210px;">MV</font>
                                    <font id="p6" style="padding-left: 110px;">时长</font>
                                </div>
                                <dl class="dl5">
                                    <dt v-for="(item,index) in get1_4.tracks" class="dt5">       
                                        <div id="menu1name"style="text-overflow:ellipsis;white-space:nowrap;">
                                            <font style="padding-left: 25px;">{{index+1}}.</font>
                                            <a href="#" @click="playMusic(item)":title="item.name"><font>{{item.name}}</font></a>
                                        </div>
                                        <div id="menu1songer"style="text-overflow:ellipsis;white-space:nowrap;">
                                            <a href="#"><font v-for="items in item.ar" @click="changeName(items.name)" :title="items.name">{{items.name}}&nbsp;&nbsp;</font></a>             
                                        </div>
                                        <div id="menu1mv" >
                                            <a href="#"><img style="vertical-align: middle;" src="img/mv.png" title="点击播放MV" width="30px" height="25px"  v-if="item.mvid!=0" @click="playMv(item)"style="padding-left:15px;"></a>                                                                                   
                                        </div>                                                                  
                                        <div id="menu1time"><font>{{item.duration}}</font></div>                                                                                  
                                        <br>                    
                                    </dt>
                                </dl>
                            </div>
                        </div> 
                    </div>
                    <div id="menu2" v-if="ismenu2">
                        <div id="menu2_1" v-show="!isViewget2music">
                            <div id="menu2left">
                                <div id="menu2search">
                                </div>
                                <div id="menu2left1">
                                    <font>地区</font><br>
                                    <a href="#"@click="get2s('-1',get2type,get2initial)":class="{newget1page:(get2area=='-1')}">全部</a><br>
                                    <a href="#"@click="get2s('7',get2type,get2initial)":class="{newget1page:(get2area=='7')}">华语</a><br>
                                    <a href="#"@click="get2s('96',get2type,get2initial)":class="{newget1page:(get2area=='96')}">欧美</a><br>
                                    <a href="#"@click="get2s('8',get2type,get2initial)":class="{newget1page:(get2area=='8')}">日本</a><br>
                                    <a href="#"@click="get2s('16',get2type,get2initial)":class="{newget1page:(get2area=='16')}">韩国</a><br>
                                    <a href="#"@click="get2s('0',get2type,get2initial)":class="{newget1page:(get2area=='0')}">其他</a>               
                                </div>
                                <div id="menu2left2">
                                    <font>类型</font><br>
                                    <a href="#"@click="get2s(get2area,'-1',get2initial)":class="{newget1page:(get2type=='-1')}">全部</a><br>
                                    <a href="#"@click="get2s(get2area,'1',get2initial)":class="{newget1page:(get2type=='1')}">男歌手</a><br>
                                    <a href="#"@click="get2s(get2area,'2',get2initial)":class="{newget1page:(get2type=='2')}">女歌手</a><br>
                                    <a href="#"@click="get2s(get2area,'3',get2initial)":class="{newget1page:(get2type=='3')}">乐队</a><br>
                                </div>
                            </div>                 
                            <div id="menu2right1">
                                <a href="#"@click="get2s(get2area,get2type,'0')"style="margin-left: 20px;":class="{newget1page:(get2initial=='0')}">全部</a>
                                <a href="#" v-for="item in get2initials" style="margin-left: 25px;" @click="get2s(get2area,get2type,item)":class="{newget1page:(get2initial==item)}">{{item}}</a>
                            </div>
                            <div id="menu2right2">
                                <div id="menu2right2_1">
                                    <font id="st2">&nbsp;</p>
                                    <div id= "menu1_2_1" v-for="(item,index) in get2songer">                                
                                        <a href="#"><img :src="item.picUrl+'?param=130y130'" :title=item.name class="coverImgUrl"@click="get2music(item)"></a><br>
                                        <a href="#" @click="get2music(item)" style="padding-bottom:0px;">{{item.name}}</a>                               
                                    </div>                            
                                    <a href="#st2" style="position: absolute;top:200px;left: 1305px;font-size: 18px;width:100px;">置顶</a>
                                    <a href="#st2" @click="get2ssub"style="position: absolute;top:545px;left: 1300px;font-size: 18px;width:100px;" v-show="get2offset>0">前一页</a>
                                    <a href="#st2" @click="get2sadd"style="position: absolute;top:580px;left: 1300px;font-size: 18px;width:100px;">换一批</a>
                                </div>
                            </div>
                        </div>
                        <div id="menu2_2" v-show="isViewget2music">
                            <div id="menu2_2_1">
                                <div style="float: left;">
                                    <div>
                                        <a href="#" @click="returnmenu2"><font style="font-size: 20px;"title="返回歌手">返回歌手</a></font>
                                        <a href="#":class="{newget1page:(get2musictype=='time')}" @click="get2ss('time')"><font style="font-size: 20px;margin-left:60px;">最新</font></a>
                                        <a href="#":class="{newget1page:(get2musictype=='hot')}" @click="get2ss('hot')"><font style="font-size: 20px;">&nbsp;热门</font></a>                                         
                                    </div>
                                    <div id="menu2_3_1">
                                        <img :src="get2newsonger.picUrl"width="150px"height="150px" :title=get2newsonger.name><br>
                                        <font :title=get2newsonger.name>{{get2newsonger.name}}</font><br>
                                    </div>
                                    <div id="menu2_3_2">
                                        <center><h3>简介</h3></center>
                                        <div id="menu2_3_2_">
                                            <font :title=get2smessages.briefDesc>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{get2smessages.briefDesc}}</font><br>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div id="menu2_2_2">
                                <font id="p6" style="padding-left: 60px;">歌名</font>
                                <font id="p6" style="padding-left: 315px;">歌手</font>
                                <font id="p6" style="padding-left: 210px;">MV</font>
                                <font id="p6" style="padding-left: 110px;">时长</font>
                                <div id="menu2_2_2_1">
                                    <dl class="dl5">
                                        <font id="st2_"></font>
                                        <dt v-for="(item,index) in get2songermusic" class="dt5">       
                                            <div id="menu1name"style="text-overflow:ellipsis;white-space:nowrap;">
                                                <font style="padding-left: 25px;">{{index+1+(get2musicoffset*30)}}.</font>
                                                <a href="#" @click="playMusic(item)":title="item.name"><font>{{item.name}}</font></a>
                                            </div>
                                            <div id="menu1songer"style="text-overflow:ellipsis;white-space:nowrap;">
                                                <a href="#"><font v-for="items in item.ar" @click="changeName(items.name)":title="items.name">{{items.name}}&nbsp;&nbsp;</font></a>             
                                            </div>
                                            <div id="menu1mv">
                                                <a href="#"><img style="vertical-align: middle;" src="img/mv.png" title="点击播放MV" width="30px" height="25px"  v-if="item.mvid!=0" @click="playMv(item)"></a>                                                                                                                                                                                             
                                            </div>
                                            <div id="menu1time"><font>{{item.duration}}</font></div>                                                                                  
                                            <br>                    
                                        </dt>
                                    </dl>
                                </div>
                                <div id="menu2_2_2_2">
                                    <a href="#st2_" @click="get2offsettop">首页&nbsp;&nbsp;</a>
                                    <a href="#st2_"><font v-show="get2musicoffset>0"@click="get2offsetsub">上一页</font></a>  
                                    <span v-for="cound in get2page">
                                        <a href="#st2_" :class="{newget1page:((get2musicoffset+1)==cound)}" v-if="get2musicoffset+5>=cound&&cound>=get2musicoffset-3" @click="get2offsetpage(cound)">{{cound}}&nbsp;&nbsp;</a>
                                    </span>
                                    <a href="#st2_"><font v-show="get2musictotal>(get2musicoffset*30+30)" @click="get2offsetadd">下一页</font></a>
                                    <a href="#st2_"@click="get2offsetbot">&nbsp;&nbsp;尾页&nbsp;&nbsp;</a>
                                    <font>第</font>
                                    <input id="get2jump" type="text" :placeholder="get2musicoffset+1"onafterpaste="this.value=this.value.replace(/\D/g,'')" onkeyup="this.value=this.value.replace(/\D/g,'')" style="width:20px;"@keyup.enter="get2jump">
                                    <font>页&nbsp;&nbsp;共有{{get2page}}页</font>
                                </div>  
                            </div>
                        </div>
                    </div>
                    <div id="menu3" v-if="ismenu3">
                        <div v-show="!isViewget3">
                            <div id="menu3_1_1">
                                <font style="font-size: 22px;">类型:&nbsp;</font>
                                <a href="#st3" @click="get3s(get3area,'全部',get3order)" :class="{newget1page:(get3type=='全部')}">全部</a>&nbsp;
                                <a href="#st3" @click="get3s(get3area,'官方版',get3order)" :class="{newget1page:(get3type=='官方版')}">官方版</a>&nbsp;
                                <a href="#st3" @click="get3s(get3area,'原生',get3order)" :class="{newget1page:(get3type=='原生')}">原生</a>&nbsp;
                                <a href="#st3" @click="get3s(get3area,'现场版',get3order)" :class="{newget1page:(get3type=='现场版')}">现场版</a>&nbsp;
                                <a href="#st3" @click="get3s(get3area,'网易出品',get3order)" :class="{newget1page:(get3type=='网易出品')}">网易出品</a>&nbsp;                
                                <font style="font-size: 22px;">|&nbsp;地区:&nbsp;</font>
                                <a href="#st3" @click="get3s('全部',get3type,get3order)" :class="{newget1page:(get3area=='全部')}">全部</a>&nbsp;
                                <a href="#st3" @click="get3s('内地',get3type,get3order)" :class="{newget1page:(get3area=='内地')}">内地</a>&nbsp;
                                <a href="#st3" @click="get3s('港台',get3type,get3order)" :class="{newget1page:(get3area=='港台')}">港台</a>&nbsp;
                                <a href="#st3" @click="get3s('欧美',get3type,get3order)" :class="{newget1page:(get3area=='欧美')}">欧美</a>&nbsp;
                                <a href="#st3" @click="get3s('日本',get3type,get3order)" :class="{newget1page:(get3area=='日本')}">日本</a>&nbsp;
                                <a href="#st3" @click="get3s('韩国',get3type,get3order)" :class="{newget1page:(get3area=='韩国')}">韩国</a>&nbsp;
                                <font style="font-size: 22px;">|&nbsp;排序:&nbsp;</font>
                                <a href="#st3" @click="get3s(get3area,get3type,'上升最快')" :class="{newget1page:(get3order=='上升最快')}">上升最快</a>&nbsp;
                                <a href="#st3" @click="get3s(get3area,get3type,'最新')" :class="{newget1page:(get3order=='最新')}">最新</a>&nbsp;
                                <a href="#st3" @click="get3s(get3area,get3type,'最热')" :class="{newget1page:(get3order=='最热')}">最热</a>
                            </div>
                            <div id="menu3_1_2">
                                <div id="menu3_1_2_">
                                    <font id="st3">&nbsp;</font>
                                    <div>
                                        <div id= "menu3_1_2_1" v-for="(item,index) in get3MV">                                
                                            <a href="#"><img :src="item.cover" :title=item.name class="coverImgUrl3"@click="get3MVid(item)"></a><br>
                                            <a href="#" @click="get3MVid(item)">{{item.name}}</a><br>
                                            <a href="#" @click="get3MVid(item)"style="margin-bottom:0px;font-weight:100;">{{item.artistName}}</a>                                 
                                        </div>
                                    </div>
                                    <div id="menu3_1_2_2">
                                        <a href="#st3" @click="get3sub" v-show="get3offset>0"style="font-size: 18px; float: left; margin-left:22%">前一页</a>
                                        <a href="#st3" @click="get3add" style="font-size: 18px; float: right; margin-right:30%">换一批</a>
                                    </div>
                                </div>                                
                            </div>                           
                        </div>
                        <div v-show="isViewget3">               
                        </div> 
                    </div>              
                    <div id="menu4" v-if="ismenu4">
                        <div id="menu4_1"v-show="!isViewget4">
                            <div id= "menu4_1_" v-for="(item,index) in get4list">                                
                                <a href="#"><img :src="item.coverImgUrl+'?param=130y130'" :title=item.name class="coverImgUrl2"@click="get4music(item)"></a><br>
                                <a href="#" :title=item.name @click="get4music(item)"style="margin-bottom:0px">{{item.name}}</a>                               
                            </div>
                        </div>
                        <div v-show="isViewget4">
                            <div style="float: left;">
                                <div>
                                    <a href="#" @click="returnmenu4"><font style="font-size: 20px;"title="返回榜单">返回榜单</font></a>  
                                </div>
                                <div id="menu4_2_1">
                                    <img :src="get4nowlist.coverImgUrl+'?param=130y130'"width="150px"height="150px" :title=get4nowlist.name><br>
                                    <font :title=get4nowlist.name>{{get1_4.name}}</font><br>
                                </div>
                                <div id="menu4_2_2">
                                    <center><h3>简介</h3></center>
                                    <div id="menu4_2_2_">
                                        <font :title=get4nowlist.description>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{get4nowlist.description}}</font><br>
                                    </div>
                                </div>
                            </div>
                            <div id="menu4_3">
                                <font id="p6" style="padding-left: 60px;">歌名</font>
                                <font id="p6" style="padding-left: 315px;">歌手</font>
                                <font id="p6" style="padding-left: 210px;">MV</font>
                                <font id="p6" style="padding-left: 110px;">时长</font>
                                <div id="menu4_3_">
                                    <dl class="dl5">
                                        <dt v-for="(item,index) in get4playlist" class="dt5">       
                                            <div id="menu1name"style="text-overflow:ellipsis;white-space:nowrap;">
                                                <font style="padding-left: 25px;">{{index+1}}.</font>
                                                <a href="#" @click="playMusic(item)":title="item.name"><font>{{item.name}}</font></a>
                                            </div>
                                            <div id="menu1songer"style="text-overflow:ellipsis;white-space:nowrap;">
                                                <a href="#"><font v-for="items in item.ar" @click="changeName(items.name)" :title="items.name">{{items.name}}&nbsp;&nbsp;</font></a>             
                                            </div>
                                            <div id="menu1mv">
                                                <a href="#"><img style="vertical-align: middle;" src="img/mv.png" title="点击播放MV" width="30px" height="25px"  v-if="item.mvid!=0" @click="playMv(item)"></a>         
                                            </div>
                                            <div id="menu1time"><font>{{item.duration}}</font></div>                                                                                  
                                            <br>                    
                                        </dt>
                                    </dl>
                                </div>                         
                            </div>
                        </div> 
                    </div>
                </div>
                <div v-show="!isViewmenu">
                    <div id="content_left">
                        <div id="content_left_0"v-show="newList.length>0">
                            <font id="p1" v-show="newList.length!=0">&nbsp;&nbsp;播放列表:{{newList.length}}首</font>
                        </div>
                        <div id="content_left_">
                            <dl class="dl1">
                                <dt v-for="(item,index) in newList" class="dt1" :class="{newplay:(newId==item.id)}">      
                                    <div id="content_left_1" :class="{cantplay:(item.id==item.mvid)}">
                                        <div id="ar"style="text-overflow:ellipsis;white-space:nowrap;">
                                            <span>&nbsp;{{index+1}}.</span>
                                            <a href="javascript:;" :title=item.name @click="playMusicAgain(item)">{{item.name}}—</a>
                                            <a v-for="(items,index) in item.artists" v-if="index==0" :title=item.name+items.name href="javascript:;"@click="changeName_artist(items.name)">{{items.name}}</a>
                                        </div>
                                        <div id="time"style="text-overflow:ellipsis;white-space:nowrap;"><font>{{item.duration}}</font></div>                                                                                       
                                    </div>                                                          
                                    <div id="content_left_2">         
                                        <a href="#"><img src="img/mv.png"title="点击播放MV" width="18px" height="20px" class="mvButton"v-if="item.mvid!=0"@click="playMvAgain(item)"></a>
                                        <a href="#"><img src="img/搜索.png" title="点击搜索歌曲" width="18px" height="20px" @click="changeName_music(item.name)"></a>
                                        <a href="#"><img src="img/删除.png" title="删除歌曲"width="18px" height="18px"class="delButton"@click="del(index)"></a>
                                    </div> 
                                    <br>                    
                                </dt>
                            </dl>
                        </div>                                    
                    </div>
                    <div id="content_middle">    
                        <div id="view1_top"v-if="isView1">
                            <font id="p3" v-show="songCount!=0">搜索结果共{{songCount}}条:</font>
                        </div>
                        <div id="view1_middle"v-if="isView1">
                            <font id="p4" style="padding-left: 15px;">序号</font>
                            <font id="p4" style="padding-left: 90px;">歌曲名</font>
                            <font id="p4" style="padding-left: 165px;">歌手</font>
                            <font id="p4" style="padding-left: 140px;">搜索</font>
                            <font id="p4" style="padding-left: 23px;">播放</font>
                            <font id="p4" style="padding-left: 21px;">MV</font>
                            <font id="p4" style="padding-left: 25px;">时长</font>
                        </div>
                        <div id="view1"v-if="isView1">                                              
                            <p id="p2"v-show="isView2"><a href="javascript:;"@click="Return">返回歌曲信息</a></p>
                            <p id="p2"v-show="isView5"><a href="javascript:;"@click="Return_">返回歌曲MV</a></p>
                            <a href="#st"><img id="imgleft" src="img/左.png"width="30px" height="20px" :title=HL[hl-L-1] v-if="HL.length>1&&hl-L>0" @click="changeName(HL[hl-(++L)])"></a>
                            <a href="#st"><img id="imgright" src="img/右.png"width="30px" height="20px" :title=HL[hl-L+1] v-if="HL.length>hl+1-L" @click="changeName(HL[hl-(--L)])"></a>                                       
                            <font id="st"></font>
                            <dl class="dl2">         
                                <dt v-for="(item,index) in musicList" class="dt2">
                                    <div id="number"style="text-overflow:ellipsis;white-space:nowrap;">
                                        <span>&nbsp;{{(offset*50)+index+1}}</span>
                                    </div>                                 
                                    <div id="name"style="text-overflow:ellipsis;white-space:nowrap;">     
                                        <a href="javascript:;" :title=item.name @click="playMusic(item)">{{item.name}}</a> 
                                    </div>                                        
                                    <div id="songer"style="text-overflow:ellipsis;white-space:nowrap;">                                       
                                        <a v-for="items in item.artists" :title=items.name href="javascript:;"@click="changeName_artist(items.name)">{{items.name}}&nbsp;&nbsp;</a>                                          
                                    </div> 
                                    <div id="operation">
                                        <img src="img/搜索.png" title="点击搜索歌曲" width="24px" height="20px" @click="changeName_music(item.name)">
                                        <img src="img/播放.png" title="点击播放歌曲" width="24px" height="20px" @click="playMusic(item)"style="padding-left:30px;">
                                        <img src="img/mv.png" title="点击播放MV" width="24px" height="20px"  v-if="item.mvid!=0" @click="playMv(item)"style="padding-left:30px;"> 
                                    </div>     
                                    <div id="duration">
                                        {{item.duration}}
                                    </div> 
                                    <br>                                                                             
                                </dt>                                                                      
                            </dl>
                            <div id="view1_bot">
                                <a href="#st" @click="offsettop">首页&nbsp;&nbsp;</a>
                                <a href="#st"><font v-if="offset>0"@click="offsetsub">上一页&nbsp;&nbsp;</font></a>  
                                <span v-for="cound in page">
                                    <a href="#st" :class="{newget1page:((offset+1)==cound)}" v-if="offset+5>=cound&&cound>=offset-3" @click="offsetpage(cound)">{{cound}}&nbsp;&nbsp;</a>
                                </span>
                                <a href="#st"><font v-show="songCount>(offset*50+50)" @click="offsetadd">下一页</font></a>
                                <a href="#st"@click="offsetbot">&nbsp;&nbsp;尾页&nbsp;&nbsp;</a>
                                <font>第</font>
                                <input id="jump" type="text" :placeholder="offset+1"onafterpaste="this.value=this.value.replace(/\D/g,'')" onkeyup="this.value=this.value.replace(/\D/g,'')" style="width:20px;"@keyup.enter="jump">
                                <font>页&nbsp;&nbsp;共有{{page}}页</font>  
                            </div>             
                        </div> 
                        <div id="view2"v-show="!isView1">
                            <p id="p2"v-show="isView2&&isdoit"><a href="javascript:;"@click="Return__">返回搜索结果</a></p>
                            <div id="view2_">
                                <div id="view2_1"v-show="!isView3">  
                                    <div v-show="!isViewcover" @click="viewcover">
                                        <a href="#"><font style="font-size: 24px;line-height: 50px;"  v-for="(item,index) in Lyric" :class="{newget1page:(keyIndex==index)}" :title="item"  @click="changetime(index)" v-if="(index>=keyIndex-5&&keyIndex>=index-5)||(10>=index&&5>=keyIndex)">{{item}}<br></font></a>
                                    </div>    
                                    <div id="cover"v-show="isViewcover">
                                        <a href="#"><img :src="musicCover" :title=newName id="musicCover":class="{musicCover:isPlaying}" @click="viewcover"></a>
                                        <p id="p5"><a href="javascript:;"@click="changeName(newName)">{{newName}}</a></p>     
                                    </div>                                                            
                                </div>                              
                                <div v-show="isView3">
                                    <p id="p9"v-show="isView5&&isdoit"><a href="javascript:;"@click="Return">返回搜索结果</a></p> 
                                    <video :src="mvUrl"id="video1"class="Video"controls="controls"autoplay></video>
                                </div>
                            </div>
                        </div>                        
                    </div>
                    <div id="content_right">
                        <div id="content_right_"v-show="isPlay||isView3">
                            <div id="content_right_0">
                                <font id="p1">热门评论:</font>
                            </div>  
                            <div id="content_right_1">
                                <dl v-for="item in hotComments">
                                    <dt class="dt3">
                                        <img :src="item.user.avatarUrl" class="avatarUrl">
                                        <font>{{item.user.nickname}}</font>
                                    </dt>
                                    <dd id="p7">{{item.content}}</dd>              
                                </dl>
                            </div>                       
                        </div>
                    </div>
                </div>               
            </div>
            <div id="foot">
                <div id="foot_"v-show="isPlay&&!isView3">
                    <div id="play">
                        <!-- <div v-show="isPlaying">
                            <marquee behavior="scroll" onMouseOver="this.stop()"onMouseOut="this.start()">
                                <font id="p8">正在播放:</font>
                                <font id="p9">{{newName}}</font> 
                            </marquee>
                        </div> -->
                        <div>                  
                            <font >正在播放:</font>
                            <font >{{newName}}</font>          
                        </div>
                    </div>
                        <audio id="audio1" ref="audio" :src="musicUrl" @play="Play"@pause="Pause" controls autoplay loop class="myaudio">
                    </audio>
                </div>            
            </div>
        </div>
    </div>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script src="听个锤子.js"></script>
    <script>
        if(localStorage.getItem("Src")!=null){
            var Src=JSON.parse(localStorage.getItem("Src"));
            document.body.style.backgroundImage='url('+Src+')';  
        }
        var count = 0
            for (var i = 97; i < 123; i++) {
            app.get2initials[count] = String.fromCharCode(i);
            count++;
        }         
    </script>   
    <script>
        var nav=document.querySelector('.nav');
        var lis=nav.children;
        for(var i=0;i<lis.length;i++){
            lis[i].onmouseover=function(){
                this.children[1].style.display=style='block';
            }
            lis[i].onmouseout=function(){
                this.children[1].style.display=style='none';
            }
        }
        //1.获取元素
        var imgs = document.querySelector('.nav').querySelectorAll('img');
    //.2.注册事件
        for(var i=0; i<imgs.length; i++){
            imgs[i].onclick =function(){
                document.body.style.backgroundImage='url('+this.src+')';  
                localStorage.setItem("Src", JSON.stringify(this.src));
                app.imgshow=false;             
            }
        }
    </script>
    <script>
        function $(id){
            return document.getElementById(id);
        }                   
            window.onload=function(){
                var au=$("audio1");  
                //console.log(au);     
                setInterval(function(){
                    if(!au.paused){
                        app.thisTime=au.currentTime;
                        //console.log(app.thisTime);
                        for(i=app.Time.length-1;i>=0;i--){
                            //console.log(app.Time[i]);
                            if(parseFloat(app.Time[i])<=parseFloat(app.thisTime)){
                                app.keyIndex=i;
                                //console.log("length="+app.Time.length);
                                //console.log(app.Time[i]);
                                //console.log(app.keyIndex);
                                break;
                            }
                        }
                    }
                },200);  //每200毫秒获取一次  
        }
        $("video1").onplay=function(){
            $("audio1").pause();
        }
        $("audio1").onplay=function(){
            $("video1").pause();
        }
        $("nav").onmouseleave=function(){
            app.imgshow=false;
        }
        app.$options.methods.get1.bind(app)(app.get1_1); //页面加载时出现歌单页面
        if(localStorage.getItem("historyList")!=null){
            app.historyList=JSON.parse(localStorage.getItem("historyList"));
        }   
        if(localStorage.getItem("newList")!=null){
            app.newList=JSON.parse(localStorage.getItem("newList"));
        }         
        $("menu1_1").onmouseleave=function(){
            app.ismenu1_1=false;
        }          
        $("historyList").onmouseleave=function(){
            app.isView4=false;
        }
        $("logo").onmousedown=function(){
            $("logo").src="img/听个锤子2.png"
        }   
        $("logo").onmouseup=function(){
            $("logo").src="img/听个锤子1.png"
        }    
    </script>   
</body>
</html>